/*
 * @Description:
 * @Author: py
 * @Date: 2024-07-30
 */
import { computed, reactive } from 'vue'

export function useTable(form: Ref<{ type: any }>) {
    const columns = computed(() => {
        if (+form.value.type === 11) {
            return [
                { type: 'seq', width: 70, title: '序号' },
                { field: 'title', minWidth: 150, title: '文章标题' },
                { field: 'field1', width: 150, title: '标签' },
                { slots: { default: 'type' }, title: '资讯类别', width: 150 },
                { slots: { default: 'noticeImg' }, title: '封面', width: 150 },
                { slots: { default: 'createTime' }, title: '创建时间', width: 200 },
                { fixed: 'right', slots: { default: 'operate' }, title: '操作', width: 150 },
            ]
        }
        if (+form.value.type === 12) {
            return [
                { type: 'seq', width: 70, title: '序号' },
                { field: 'title', minWidth: 150, title: '标题' },
                { field: 'field2', width: 150, title: '描述' },
                { slots: { default: 'type' }, title: '资讯类别', width: 150 },
                { slots: { default: 'noticeImg' }, title: '封面', width: 150 },
                { slots: { default: 'createTime' }, title: '创建时间', width: 200 },
                { fixed: 'right', slots: { default: 'operate' }, title: '操作', width: 150 },
            ]
        }
        return [
            { type: 'seq', width: 70, title: '序号' },
            { field: 'title', minWidth: 150, title: '文章标题' },
            { slots: { default: 'type' }, title: '资讯类别', width: 150 },
            { slots: { default: 'noticeImg' }, title: '封面', width: 150 },
            { slots: { default: 'createTime' }, title: '创建时间', width: 200 },
            { fixed: 'right', slots: { default: 'operate' }, title: '操作', width: 150 },
        ]
    })

    const gridOptions = reactive<any>({
        align: 'center',
        border: true,
        columnConfig: {
            resizable: true,
        },
        // columns: [
        //     { type: 'seq', width: 70, title: '序号' },
        //     { field: 'title', minWidth: 150, title: '文章标题' },
        //     { slots: { default: 'type' }, title: '资讯类别', width: 150 },
        //     { slots: { default: 'noticeImg' }, title: '封面', width: 150 },
        //     { slots: { default: 'createTime' }, title: '创建时间', width: 200 },
        //     { fixed: 'right', slots: { default: 'operate' }, title: '操作', width: 150 },
        // ],
        columns,
        data: [],
        height: 530,
        loading: false,
        showOverflow: false,
        toolbarConfig: {
            slots: {
                buttons: 'toolbar_buttons',
            },
        },
    })

    return { gridOptions }
}

export function usePropertyTable() {
    const gridOptions = reactive<any>({
        align: 'center',
        border: true,
        columnConfig: {
            resizable: true,
        },
        columns: [
            { type: 'seq', width: 70, title: '序号' },
            { field: 'title', minWidth: 200, title: '项目名称' },
            { slots: { default: 'type' }, title: '资讯类别', width: 100 },
            { slots: { default: 'assetImg' }, title: '封面', width: 80 },
            { slots: { default: 'label' }, width: 150, title: '标签' },
            { slots: { default: 'address' }, width: 150, title: '地址' },
            { field: 'price', width: 150, title: '价格' },
            { slots: { default: 'createTime' }, title: '创建时间', width: 180 },
            { fixed: 'right', slots: { default: 'operate' }, title: '操作', width: 150 },
        ],
        data: [],
        height: 530,
        loading: false,
        showOverflow: false,
        toolbarConfig: {
            slots: {
                buttons: 'toolbar_buttons',
            },
        },
    })

    return { gridOptions }
}
